<template>
  <div class="page-style">
    <btn-area :current-data="currentData" @search="searchFun" />
    <table-data :table-data="list" :brand-id="brandId" @selectVal="currentVal" />
    <pagination :total="total" @pagination="pagination" />
  </div>
</template>

<script>
import btnArea from '../../../components/trees/btn'
import tableData from '../../../components/trees/table'
import { getAgentList } from '@/api/agent'
import pagination from '@/components/Pagination'
export default {
  components: {
    btnArea,
    tableData,
    pagination
  },
  data() {
    return {
      p: 1,
      num: 10,
      anent_name: '',
      brand_phone: '',
      brandId: '',
      level: '',
      total: 0,
      list: [],
      currentData: {}
    }
  },
  created() {
    console.log('1', this.$route.meta)
    this.brandId = this.$route.meta.brandId
    this.level = this.$route.meta.level
    this.getAgentListFun()
  },
  methods: {
    getAgentListFun(brandId, level) {
      const data = {
        p: this.p,
        num: this.num,
        brand_id: this.brandId,
        level: this.level,
        anent_name: this.anent_name,
        brand_phone: this.brand_phone
      }
      getAgentList(data).then(res => {
        console.log(res)
        this.total = Number(res.count)
        this.list = res.list
      })
    },
    pagination(val) {
      this.p = val.page
      this.num = val.limit
      this.getAgentListFun()
    },
    searchFun(val) {
      this.anent_name = val.anent_name
      this.brand_phone = val.brand_phone
      this.getAgentListFun()
    },
    currentVal(val) {
      this.currentData = val
    }
  }
}
</script>

<style lang="sass" scoped>

</style>
